<!-- z-paging自定义的下拉刷新view -->
<template>
   <view class="refresher-container">
      <!-- 这里的图片请换成自己项目的图片 -->
      <image
         class="refresher-image"
         mode="aspectFit"
         src="https://dsfw.oss-cn-shanghai.aliyuncs.com/202211272034778.gif"
      ></image>
      <text class="refresher-text">{{ statusText }}</text>
   </view>
</template>

<script>
export default {
   data() {
      return {};
   },
   computed: {
      statusText() {
         // 这里可以做i18n国际化相关操作，可以通过uni.getLocale()获取当前语言(具体操作见i18n-demo.vue);
         // 获取到当前语言之后，就可以自定义不同语言下的展示内容了
         const statusTextArr = ['哎呀，用点力继续下拉！', '拉疼我啦，松手刷新~~', '正在努力刷新中...', '刷新成功啦~'];
         return statusTextArr[this.status];
      }
   },
   props: {
      status: {
         type: Number,
         default: function () {
            return 0;
         }
      }
   }
};
</script>

<style scoped>
.refresher-container {
   /* #ifndef APP-NVUE */
   display: flex;
   /* #endif */
   height: 150rpx;
   flex-direction: column;
   align-items: center;
   justify-content: center;
}

.refresher-image {
   margin-top: 10rpx;
   height: 45px;
   width: 45px;
}

.refresher-text {
   margin-top: 10rpx;
   font-size: 24rpx;
   color: #666666;
}
</style>
